<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no, email=no" />
    <meta property="og:title" content="">
    <!-- 分享描述 通常2-4句-->
    <meta property="og:description" content="">
    <!-- 网站名字-->
    <meta property="og:site_name" content="">
    <!-- 分享插图-->
    <meta property="og:image" content="">
    <!-- 分享链接-->
    <meta property="og:url" content="">
    <!-- facebook user id 可以多个-->
    <meta property="fb:admins" content="">
    <!-- facebook app id 统计facetook引流-->
    <meta property="fb:app_id" content="1634108950233660">
    <!-- 分享媒体类型 决定在facebook feed流中的展现形式 默认为website article vine-app:video-->
    <meta property="og:type" content="article">
    <link rel="icon" type="image/png" href="../img/icon.png" sizes="32x32" />
    <link rel="stylesheet" href="../css/css.css" type="text/css"/>
    <link href="http://vjs.zencdn.net/5.8.8/video-js.css" rel="stylesheet">
    <script src="http://vjs.zencdn.net/5.8.8/video.js"></script>
    <title>Virally.video</title>
    <style type="text/css">
        .video-js{
            width: 100%!important;
            height: 100%!important;
        }
        video::-webkit-media-controls {
            display:none !important;
        }
    </style>
</head>
<body>
    <div id="header">
        <div class="header_left">
            <p>Virally.video</p>
        </div>
        <div class="header_right">
            <a href="https://itunes.apple.com/us/app/chao-ji-tou-tiao/id1149308012?l=zh&ls=1&mt=8">Install</a>
            <div class="close">
                <img src="../img/ic_delete.png"/>
            </div>
        </div>
    </div>
    <div class="header_next" style="height: 44px"></div>
    <div id="video">

    </div>

</body>
<script type="text/html" id="video_detail">
    <div class="video_play">
        <video id="my-video" class="video-js vjs-default-skin vjs-big-play-centered"  controls preload="auto"
               poster="<%=image_url%>"  data-setup='{}' webkit-playsinline>
                <source src="<%=display_url%>" type="video/mp4"/>
                <source src="<%=display_url%>" type="video/webm">
                <source src="<%=display_url%>" type="video/ogg">
        </video>
    </div>
    <div class="video_list">
        <div class="video_play_content">
            <h5><%=title%></h5>
            <p class="video_play_count"><%=video_play_count%>次播放</p>
            <div class="video_play_name">
                <div class="video_play_name_left" media_id="<%=media_id%>">
                    <img src="<%=media_avatar_url%>"/> <%=media_name%>
                </div>
                <div class="video_play_name_right">
                    關注
                </div>
            </div>
        </div>

    </div>
</script>

<script type="text/html" id="video_list">
    <ul>
        <%for(var i=0;i<data.length;i++){%>
        <li _id="<%=data[i]._id%>">
            <div class="video_list_img" style="background:#ccc url('<%=data[i].image_url%>') no-repeat center center;background-size: cover;">
                <p class="time"><%=data[i].video_duration_str%></p>
            </div>
            <div class="li_left">
                <h5><%=data[i].title%></h5>
                <p><%=data[i].video_play_count%>次播放</p>
            </div>
        </li>
        <%}%>
    </ul>
</script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/template-native.js"></script>
<script type="text/javascript" src="../js/index.js"></script>
</html>
